import React, {useState} from 'react';
import './index.scss'
import { Col, Divider, Row } from 'antd';
interface IBox {
    value: number
}

const Box: React.FC<IBox> = (props, context) => {
    // const [value] = useState(1);
    const value:number = props.value
    if (value === 0) {
        return <Col span={0.5}>
            <div className="snake-box box0"/>
        </Col>
    } else if (value === 1) {
        return <Col span={0.5}>
            <div className="snake-box box1"/>
        </Col>
    } else if (value === 2) {
        return <Col span={0.5}>
            <div className="snake-box box2"/>
        </Col>
    } else if (value === 3) {
        return <Col span={0.5}>
            <div className="snake-box box3"/>
        </Col>
    } else {
        return <div className="snake-box box0"/>
    }
}

export default Box;